<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>小米su7的卡片</title>
		<style>
				body{
							background-color: #fffef9;
						}
						#product_card{
						                width: 250px;
						                height: 500px;
						                background-color: #fff;
						                margin:200px auto;
						                box-shadow: 0px 0px 10px #cecece;
						                border-radius: 4px;
						            }
						div#resource{
						                width: 225px;
						                height: 500px;
						                background-image: url(../img/che.jpg);
										background-repeat: no-repeat;
										background-size: 225px 320px;
										position: relative;
										border-radius: 6px;
										margin-left:13px;
										top:14px;
						                
						            }
						h1{
							padding-top: 345px;
							padding-left: 65px;
							font-size: 22px;
							font-weight:550;
						}
						h2{
							padding-top: 1px;
							padding-left:48px;
							color:#e4393c;
							font-weight:400;
						}
						#d1{
							margin-top: -8px;
							margin-left: 56px;
						}
						#d2{
							margin-top: -20px;
							margin-left: 77px;
						}
						#d1,#d2,#number{
						                font-size: 14px; 
						                color: #757575;
						}
						
						#d3{
							width: 280px;
							height: 50px;
							background-color: #fffff;
							box-shadow: 0px 0px 10px #cecece;
							margin-top: -800px;
							margin-left: 630px;
							border-radius:4px;
							color:#757575;
							line-height: 49px;
						}
						#d4{
							width: 59px;
							height: 37px;
							background-color: #e4393c;
							border-radius: 4px;
							color:#fff;
							position: relative;
							top:-42px;
							left:215px;
							 text-align: center;
							 line-height: 37px;
			                font-size: 16px;
						}
		</style>
	</head>
	<body>
		<div id="product_card">
					<div id="resource">
						<h1>小米SU7</h1>
						  <h2>¥279999.00</h2>
						    <div id="d1">已有
							<span id="number">10万+</span>
							  <div id="d2">人评论
							  </div>
							  </div>
					          </div>
				              </div>
					<!-- 搜索框 -->
					<div id="d3">
						&nbsp;&nbsp;&nbsp;&nbsp;搜索 京东商品
					<div id="d4">搜索</div>
					</div>
	</body>
</html>